<template>
	<el-dropdown :hide-on-click="true" @command="handleCommand" v-if="showLanguage">
		<span class="el-dropdown-link">
			<vab-remix-icon :title="lan.changeTitle" icon="english-input" :style="'color:' + color" class="topIco"
				v-bind="$attrs" v-on="$listeners" />
		</span>
		<el-dropdown-menu slot="dropdown">
			<el-dropdown-item command="zh-cn">中文简体</el-dropdown-item>
			<el-dropdown-item command="english">English</el-dropdown-item>
		</el-dropdown-menu>
	</el-dropdown>
</template>

<script>
	import config from "@/common/config.js";
	import common from "@/common/common.js";

	export default {
		name: "language",
		props: {
			color: {
				type: String
			}
		},
		computed: {
			showLanguage() {
				return config.showLanguage;
			},
			lan() {
				var lang = this.$store.state.language;
				var path = "language";
				var r = lang[path];
				if (r == null) return {};
				return r;
			}
		},
		created: function() {},
		methods: {
			handleCommand(command) {
				this.$store.dispatch("setLang", command);
				this.$store.dispatch("delAllVisitedRoutes");
				location.reload();
			}
		}
	}
</script>

<style>
</style>
